﻿@using NFine.Domain.Entity.SystemManage
@model List<NFine.Domain.Entity.ProductManage.ProductEntity>
@{
    ViewBag.Title = "创建订单";
    Layout = "~/Views/Shared/_Form.cshtml";
}
<style>
    .pro, .pro tr, .pro tr td, .pro tr th {
        border: 1px solid #ddd;
        line-height: 30px;
        text-align: center;
    }

    .proShow, .proShow tr, .proShow tr td, .proShow tr th {
        border: 1px solid #ddd;
        line-height: 30px;
        text-align: center;
    }

    .num {
        width: 50px;
        text-align: center;
        float: left;
        height: 30px;
    }

    .setnum {
        border: 1px solid rgb(169,169,169);
        display: block;
        width: 24.5px;
        text-align: center;
        height: 30px;
        line-height: 30px;
    }
</style>
<form id="form1">
    <div class="widget-body">
        <div id="wizard" class="wizard" data-target="#wizard-steps" style="border-left: none; border-top: none; border-right: none;">
            <ul class="steps">
                <li data-target="#step-1" class="activeW"><span class="step">1</span>商品列表<span class="chevron"></span></li>
                <li data-target="#step-2"><span class="step">2</span>地址信息<span class="chevron"></span></li>
            </ul>
        </div>
        <div class="step-content" id="wizard-steps" style="border-left: none; border-bottom: none; border-right: none; overflow-y:scroll; overflow-x:hidden; height:722px;">
            <div class="step-pane activeW" id="step-1" style="margin: 10px; margin-bottom: 0px;">
                @if ((bool)ViewData["FirstOrder"])
                {
                    <div style="margin-top:10px; margin-bottom:10px; color:#1ABC9C;">尊敬的会员用户您好，首次下单，该笔订单金额需要大于或等于 @ViewData["OrderMoney"] 元</div>
                }
                else
                {
                    <div style="margin-top:10px; margin-bottom:10px; color:#1ABC9C;">尊敬的会员用户您好，欢迎再次下单，新的订单享受6折哟！</div>
                }


                <div class="panel panel-default">
                    <table class="pro" style="width:100%">
                        <tr style="background-color:rgb(245,245,245)">
                            <td class="tdCheckAll">
                                <input id="agree" type="checkbox" onclick="javascript:checkclick('agree')" />
                            </td>
                            <th style="width:100px">商品图片</th>
                            <th>商品名称</th>
                            <th style="width:120px">商品单价</th>
                            <th style="width:100px">数量</th>
                            <th style="width: 100px">金额</th>
                        </tr>
                        @for (var i = 0; i < Model.Count; i++)
                        {
                            var pro = Model[i];
                            <tr>
                                <td class="tdFirst">
                                    <input type="checkbox" name="proCheck" flag="@pro.F_Id" id="@("product" + i)" onclick="javascript:checkclick('@("product" + i)')" data-img="@pro.F_ImageUrl" data-name="@pro.F_ProductName" />
                                </td>
                                <td style="width:100px"><img src="@pro.F_ImageUrl" style="width:100px;" /> </td>
                                <td style="text-align:left;vertical-align:top;padding-left:5px;"><a href="#"> @pro.F_ProductName</a></td>
                                <td style="width:120px;" class="tdPrice ">￥@pro.F_Price</td>
                                <td style="width:100px" class="tdP">
                                    <span class="setnum" style="border-right:none;float:left;" onclick="javascript:updateNum(@(i), 0);">-</span>
                                    <input id="@("txtNumber_" + i)" type="number" value="0" class="num" onkeyup="javascript:updateNum(@(i), -1);" />
                                    <span class="setnum" style="border-left:none;float:left;" onclick="javascript:updateNum(@(i), 1)">+</span>
                                </td>
                                <td style="width: 100px">￥@pro.F_Price </td>
                            </tr>
                        }
                    </table>
                </div>
            </div>
            <div class="step-pane" id="step-2">
                <table class="form" style="width:500px">
                    <tr>
                        <th class="formTitle">收货人</th>
                        <td class="formValue">
                            <input id="F_Consignee" name="F_Consignee" type="text" class="form-control required" placeholder="请输入收货人" value="@ViewData["UserName"]" />
                        </td>
                    </tr>
                    <tr>
                        <th class="formTitle">联系电话</th>
                        <td class="formValue">
                            <input id="F_ContactNumber" name="F_ContactNumber" type="text" class="form-control required isMobile" placeholder="请输入联系电话" value="@ViewData["phone"]" />
                        </td>

                    </tr>
                    <tr>
                        <th class="formTitle">中转中心</th>
                        <td class="formValue">
                            <select id="F_TransferCenterId" class="form-control required" >
                                @if (ViewData["TransferCenterList"] != null)
                                {
                                    foreach (var entity in (List<UserEntity>)ViewData["TransferCenterList"])
                                    {
                                        if (@entity.F_Id == ViewData["tid"].ToString())
                                        {
                                            <option value="@entity.F_Id" selected="selected">@entity.F_RealName</option>
                                        }
                                        else
                                        {
                                         <option value="@entity.F_Id"  >@entity.F_RealName</option>
                                        }
                                    }
                                }
                            
                            </select>
                        </td>
                        
                    </tr>
                    @*<tr>
                        <th class="formTitle" valign="top" style="padding-top: 5px;">收货地址</th>
                        <td class="formValue">
                            <textarea id="F_Address" name="F_Address" class="form-control required" placeholder="请输入收货地址" style="height: 60px;"></textarea>
                        </td>

                    </tr>*@
                    <tr>
                        <th class="formTitle" valign="top" style="padding-top: 5px;">
                            备注
                        </th>
                        <td class="formValue">
                            <textarea id="F_Remark" name="F_Remark" class="form-control" style="height: 60px;"></textarea>
                        </td>
                    </tr>
                    
                    
                    <tr>
                        <th class="formTitle">
                            积分余额
                        </th>
                        <td class="formValue">
                            <span id="userProperty">-</span>
                        </td>
                        <th class="formTitle">是否抵用积分</th>
                        <td class="formValue">
                            <div class="ckbox">
                                <input id="F_IsUseIntegral" name="F_IsUseIntegral" type="checkbox" /><label for="F_IsUseIntegral">是</label>
                            </div>
                        </td>
                    </tr>

                </table>
                <table class="proShow" style="width:100%">
                    <tr style="background-color:rgb(245,245,245)">
                        <th style="width:100px">商品图片</th>
                        <th>商品名称</th>
                        <th style="width:120px">商品单价</th>
                        <th style="width:100px">数量</th>
                        <th style="width: 100px">金额</th>
                    </tr>

                </table>

            </div>
        </div>
        <div class="form-button" id="wizard-actions">
            已选<span class="tdTotal" id="spTotal"> 0 </span>件商品
            总计：<span class="tdTotal" id="spAmount">0.00</span>
            <span class="tdTotal hide" id="spAmount1">0.00</span>
            元
            <a id="btn_last" disabled class="btn btn-default btn-prev">上一步</a>
            <a id="btn_next" class="btn btn-default btn-next">下一步</a>
            <a id="btn_finish" class="btn btn-default" style="display: none;" onclick="submitForm()">完成</a>
        </div>
    </div>
</form>
<script>
    var amout = 0.0;
    var total = 0;
    var firstOrder=@ViewData["FirstOrder"].ToString().ToLower();

    $(function () {


        getProperty();

        $('#wizard').wizard().on('change', function (e, data) {
            var $finish = $("#btn_finish");
            var $next = $("#btn_next");
            if (data.direction == "next") {
                switch (data.step) {
                    case 1:
                        var _checkPro = $(".pro").find(":checkbox[name='proCheck']:checked");
                        if (_checkPro.length == 0) {
                            $.modalAlert("请先选择商品！", "error");
                            e.preventDefault();
                        }else if(firstOrder&&amout < @ViewData["OrderMoney"] ){
                            $.modalAlert('订单金额不满 @ViewData["OrderMoney"] 元！', "error");
                            e.preventDefault();       
                        }   
                    else {
                            $finish.show();
                            $next.hide();

                        //显示选择的商品
                        //var $checkbox = $(".pro").find(":checkbox[name='proCheck']:checked");
                        var _html = "";
                        for (var i = 0; i < _checkPro.length; i++) {
                            var _cur = $(_checkPro[i]);
                            var _proImg = _cur.data("img");//商品img
                            var _proName = _cur.data("name");//商品name
                            var _num = parseInt(_cur.parent().siblings(".tdP").find("input[id^='txtNumber_']").val());//商品数量
                            var _price = parseFloat(_cur.parent().siblings(".tdPrice").html().replace('￥', ''));//商品单价
                            _html += '<tr class="trNew"><td style="width:100px"><img src="' + _proImg + '" style="width:100px;" /> </td>';
                            _html += '<td style="text-align:left;vertical-align:top;padding-left:5px;">' + _proName + '</td>';
                            _html += ' <td style="width:120px;">￥' + _price + '</td>';
                            _html += ' <td style="width:100px">' + _num + '</td>';
                            _html += '<td style="width: 100px">￥' + _price * _num + '</td></tr>';
                        }
                        //$(".proShow").remove("tr[class='trNew']");
                        $(".proShow").html(_html);
                    }
                    break;
                    default:
                        break;
    }
    } else {
                $finish.hide();
    $next.show();
    }
    });
    })
    //复选框选择事件
    function checkclick(item) {
        if (item.indexOf("agree") >= 0) {
            $(".pro input[type='checkbox']").each(function () {
                if ($(this).attr("id") != "agree") {
                    $(this).prop("checked", $("#agree").prop("checked"));
                }
            });
        }
        updateFooter();
    }
    //商品数量的增减
    function updateNum(id, f) {

        var $obj = $("#txtNumber_" + id);
        //至少为1
        if ($obj.val() == "") {
            $obj.val(1);
        }
        var _val = parseInt($obj.val());
        var _price = parseFloat($obj.parent().prev().html().replace('￥', ''));
        var $total = $obj.parent().next();
        if (f != -1) {
            if (f == 0) {
                if ($obj.val() > 1) {
                    _val -= 1;
                }
            } else {
                _val += 1;
            }
            $obj.val(_val);
        } else {
            $obj.val($obj.val().replace(/\D/g, ''));
        }
        var nowPrice = _price * _val;
        $total.html("￥" + nowPrice.toFixed(2));

        $obj.parent().siblings(".tdFirst").find(":checkbox[name='proCheck']").prop("checked", true);
        updateFooter();
    }

    //设置底部数量和价格
    function updateFooter() {
        /*根据所选择的商品计算总数和总价*/
        var $checkbox = $(".pro").find(":checkbox[name='proCheck']:checked");
        amout=total=0;
        for (var i = 0; i < $checkbox.length; i++) {
            var _td = $($checkbox[i]).parent();
            var _price = parseFloat(_td.siblings(".tdPrice").html().replace('￥', ''))
            var _num = parseInt(_td.siblings(".tdP").find("input[id^='txtNumber_']").val());
            total += _num;
            amout += _price * _num;
        }
        $("#spTotal").html(" " + total + " ");
        $("#spAmount").html("￥" + amout.toFixed(2));

        if(!firstOrder)
        {
            $("#spAmount").css("text-decoration","line-through");
            $("#spAmount1").html("￥" + (amout*0.65).toFixed(2)).show;
            $("#spAmount1").removeClass("hide");
        }
    }
    function submitForm() {
        if (!$('#form1').formValid()) {
            return false;
        }
        var json = new Array();
        var allAmount=0.0;
        //购买的商品
        var $checkbox = $(".pro").find(":checkbox[name='proCheck']:checked");
        for (var i = 0; i < $checkbox.length; i++) {
            var _cur = $($checkbox[i]);
            var _proID = _cur.attr("flag");//商品id
            var _proImg = _cur.data("img");//商品img
            var _proName = _cur.data("name");//商品name
            var _num = parseInt(_cur.parent().siblings(".tdP").find("input[id^='txtNumber_']").val());//商品数量
            var _price = parseFloat(_cur.parent().siblings(".tdPrice").html().replace('￥', ''));//商品单价
            allAmount+=_num*_price;
            json.push({ "F_ProductId": _proID, "F_ProductName": _proName, "F_ThumbnailsUrl": _proImg, "F_Quantity": _num, "F_SellPrice": _price, "F_TotalPrice": _num *_price});
        }

        // 判断积分抵用是否满足
        if ($('#F_IsUseIntegral').prop('checked')) {
            var userProperty = $('#userProperty').html();
            var fuserProperty = parseFloat(userProperty);

            if (fuserProperty < allAmount) {
                alert("积分余额不足，不可抵扣！");
                return false;
            }

        }

        if(firstOrder&&allAmount<@ViewData["OrderMoney"])
        {
           $.modalAlert('订单金额不满 @ViewData["OrderMoney"] 元！', "error");
           return false;
    }

    var strJson = JSON.stringify(json);
    strJson= encodeURI(strJson);
    var postData = $("#form1").formSerialize();
    postData["jsonData"] = strJson;
    $.submitForm({
        url: "/ProductManage/Order/SubmitForm",
        param: postData,
        success: function () {
            $.currentWindow().$("#gridList").trigger("reloadGrid");
        }
    });
    }


    function getProperty() {
        $.ajax({
            url: "/MemberManage/MemberWithdrawals/GetProperty",
            success: function (result) {
                var data = eval('(' + result + ')');
                $('#userProperty').html(data.userProperty);
                userMoney = data.userProperty;
            }
        });
    }
</script>
